<template>
  <div class="start-menu-container" @click.self="$emit('close')">
    <div class="start-menu">
      <div class="menu-item" @click="handleSettings">
        <span>设置</span>
      </div>
      <div class="menu-item" @click="handleHelp">
        <span>帮助</span>
      </div>
      <div class="menu-item" @click="handleExit">
        <span>退出</span>
      </div>
    </div>
  </div>
</template>

<script setup>
const handleSettings = () => {
  // 实现设置功能
}

const handleHelp = () => {
  alert('摸鱼小站使用说明：点击桌面图标进入对应的小游戏，遇到老板请迅速点击"回收站"')
}

const handleExit = () => {
  window.close()
}
</script>

<style lang="scss" scoped>
.start-menu-container {
  position: fixed;
  bottom: 40px;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  padding: 10px;
}

.start-menu {
  background: white;
  border-radius: 4px;
  min-width: 200px;
}

.menu-item {
  padding: 10px 20px;
  cursor: pointer;
  
  &:hover {
    background: #f0f0f0;
  }
}
</style> 